<template>
  <div>
    <p class="a">{{ basketball }}</p>
    <!-- 竖的轮播图 -->
    <van-swipe style="height: 700px;" autoplay=3000 vertical>
  <van-swipe-item><van-image width="100%" height="100%" fit="cover" src="/assets/篮球1.gif" /></van-swipe-item>
  <van-swipe-item><van-image width="100%" height="100%" fit="cover" src="/assets/篮球2.gif" /></van-swipe-item>
  <van-swipe-item><van-image width="100%" height="100%" fit="cover" src="/assets/篮球3.gif" /></van-swipe-item>
  <van-swipe-item><van-image width="100%" height="100%" fit="cover" src="/assets/篮球4.gif" /></van-swipe-item>
</van-swipe>
  </div>
</template>

<script>
import { mapState } from 'vuex'

export default {
  name: 'Basketball',
  computed: {
    ...mapState(['basketball'])
  }
}
</script>

<style>
.a {
  font-size: 40px;
  margin: auto;
  margin-top: 5%;
  text-align: center;
  font-family:"⿊体";
}
</style>

